<template>
  <view class="box">
    <view class="box1">
      <view class="box12">
        <view class="box2">全部</view>
        <view class="box21">出售中</view>
        <view class="box22">已售完</view>
        <view class="box23">仓库中</view>
        <view class="box24">已下架</view>
        <view class="box25"></view>
      </view>
      <view class="box3">
      <view class="box31">
      <image src="/static/image8.png" /></view>
      <view class="box32">小米手环6  全面彩屏  30种运动模式</view>
    <view class="box33">24h心率检测智能运动手...</view>
    <view class="box34">￥120.00</view>
    <view class="box35">￥180.00</view>
    <view class="box36">月销180</view>
   
    </view>
    <view class="box4">
      <view class="box31">
      <image src="/static/image8.png" /></view>
      <view class="box32">小米手环6  全面彩屏  30种运动模式</view>
    <view class="box33">24h心率检测智能运动手...</view>
    <view class="box34">￥120.00</view>
    <view class="box35">￥180.00</view>
    <view class="box36">月销180</view>
    
    </view>
    <view class="box5">
      <view class="box31">
      <image src="/static/image8.png" /></view>
      <view class="box32">小米手环6  全面彩屏  30种运动模式</view>
    <view class="box33">24h心率检测智能运动手...</view>
    <view class="box34">￥120.00</view>
    <view class="box35">￥180.00</view>
    <view class="box36">月销180</view>
   
    </view>
    <view class="box6">
      <view class="box31">
      <image src="/static/image8.png" /></view>
      <view class="box32">小米手环6  全面彩屏  30种运动模式</view>
    <view class="box33">24h心率检测智能运动手...</view>
    <view class="box34">￥120.00</view>
    <view class="box35">￥180.00</view>
    <view class="box36">月销180</view>
   
    </view>
    </view>
  </view>
</template>

<script>
  export default {
    data() {
      return {
        
      }
    },
    methods: {
      
    }
  }
</script>

<style>
/* 4 */
.box6{
  background-color: white;
  margin:0rpx 20rpx auto;
  border-radius: 10rpx;
  height: 300rpx;
}
/* 3 */
.box5{
  background-color: white;
  margin:0rpx 20rpx auto;
  border-radius: 10rpx;
  height: 300rpx;
}
/* 2 */
.box4{
  background-color: white;
  margin:0rpx 20rpx auto;
  border-radius: 10rpx;
  height: 300rpx;
}
/* 1 */
.box36{
  margin-left: 550rpx;
  font-size: 25rpx;
  color: darkgray;
  margin-top: -18rpx;
}
.box35{
  margin-left:270rpx;
  font-size: 25rpx;
  color: darkgray;
  margin-top: 15rpx;
  text-decoration: line-through;
}
.box34{
  margin-left: 270rpx;
  margin-top: 20rpx;
  color: red;
}
/* .box37{
  margin-top: 65rpx;
  width: 180rpx;
  margin-left: 520rpx;
} */
.box32{
  margin-left: 260rpx;
  font-size: 28rpx;
  margin-top: -250rpx;
}
.box33{
  margin-left: 260rpx;
  font-size: 28rpx;
  margin-top: 10rpx;
}
.box3{
  background-color: white;
  margin:0rpx 20rpx auto;
  border-radius: 10rpx;
  height: 300rpx;
}
.box31{
  margin-top: 30rpx;
  width: 400rpx;

}
.box31 image{
  width: 250rpx;
  height: 260rpx;
  margin-top: 7px;
  margin-left: 10rpx;
}
.box25{
  border: 1rpx solid red;
  background-color: red;
  height: 7rpx;
  margin-top: 60rpx;
  width: 45rpx;
  margin-left: -640rpx;
}
.box{
  background-color: rgb(241, 240, 240);
  height: 1395rpx;
}
.box24{
  margin-left: 50rpx;
  color: rgb(104, 103, 103);
}
.box23{
  margin-left: 50rpx;
  color: rgb(104, 103, 103);
}
.box22{
  margin-left: 50rpx;
  color: rgb(104, 103, 103);
}
.box21{
  margin-left: 50rpx;
  color: rgb(104, 103, 103);
}
.box2{
  color: red;
}
.box12{
  display: flex;
  padding-left: 45rpx;
  margin-top: 30rpx;
  background-color: white;
}
</style>
